<template>
  <view class="main_orderList">
    <view class="orderList_title"><text>我的订单</text></view>
    <view class="" v-for="(item,index) in orderList" :key="index">
      <view class="orderList_orderNo">
        <text>订单号:{{item.order_number}}</text>
      </view>
      <view class="orderList_item" v-for="(v,i) in item.goods" :key="i">
        <view class="orderList_item_image">
          <image :src="v.goods_small_logo" mode=""></image>
        </view>
        <view class="orderList_item_right">
          <view class="orderList_item_right_text">
            <text>商品名称:{{v.goods_name}}</text>
            <text>购买数量:{{v.goods_number}}</text>
            <text>商品单价:{{v.goods_price}}</text>
            <text>商品总价:{{v.goods_total_price}}</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        orderList: []
      }
    },
    methods: {
      async getOrderList() {
        const result = await uni.$http.get('/api/public/v1/my/orders/all', {
          type: 1
        })
        this.orderList = result.data.message.orders
      }
    },
    onLoad() {
      this.getOrderList()
    }
  }
</script>

<style lang="scss">
  .orderList_title {
    width: 100%;
    height: 80rpx;
    background: wheat;
    text-align: center;
    line-height: 80rpx;
    font-size: 38rpx;
    font-weight: bold;
  }

  .orderList_item {
    display: flex;
    width: 100%;

    .orderList_item_image {
      width: 100%;
      height: 180rpx;

      image {
        width: 100%;
        height: 100%;
      }
    }

    .orderList_item_right {
      .orderList_item_right_text {
        display: flex;
        flex-direction: column;
      }
    }

  }
</style>